<!doctype html>
<html lang="en">
<head>
<title>设备保养</title>
	<meta name="keywords" content="keyword1,keyword2,keyword3">
	<meta name="description" content="设备保养">
	<meta name="content-type" content="text/html; charset=UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<script src="../../script/js/echart/js/jquery-3.2.1.min.js"></script>
	<link rel="stylesheet" type="text/css" href="../../script/js/layui/css/layui.css" media="all">
	<script type="text/javascript" src="../../script/js/layui/layui.js"></script>
	<script type="text/javascript" src="../../mes/js/vue.min.js"></script>
	<script type="text/javascript" src="../../mes/js/vue-resource.min.js"></script>
</head>

<body id="production">
<form class="layui-form layui-form-pane">
 <fieldset class="layui-elem-field layui-field-title">
  <legend><font color="white">设备信息</font></legend>
			<div class="layui-form-item">
				<div class="layui-inline">
						<label class="layui-form-label" style="width:130px;">计划编码</label> 
						<div class="layui-input-inline" style="width:230px;">
							 <select name="modules" lay-verify="required" lay-search="" lay-filter="processId">
			        			<option value="">直接选择或搜索选择</option>
								<option v-for="sel in sels" value="{{sel.CODE}}" >{{sel.CODE}}---{{sel.NAME}}</option>
							</select>
						</div>
				</div>
				<div class="layui-inline" id ='window3'>
						<label class="layui-form-label" style="width:130px;"> 设备编码</label> 
						<div class="layui-input-inline">
						    <select v-model="selecteds" lay-filter="facilityId" id="facilityId">
								
							</select>
						</div>
				</div>
				
	</fieldset>		
			
			
  <fieldset class="layui-elem-field layui-field-title" id = 'window1'>
  <legend><font color="white">保养设备信息</font></legend>
			<div class="layui-form-item">
				<div class="layui-form-item" >
					
				
					<div class="layui-inline" style="color:gray;">
						<label class="layui-form-label" style="width:130px;"> 设备名称：</label>
						<div class="layui-input-inline">
							<input type="text" id="types2" class="layui-input" v-model="manuOrder.NAME" disabled="" style="color:gray;">
						</div>
				</div>
			
				</div>	
				<div class="layui-form-item" style="color:gray;">
					<div class="layui-inline">
						<label class="layui-form-label" style="width:130px;"> 车间：</label>
						<div class="layui-input-inline">
							<input type="text" id="types5" class="layui-input" v-model="manuOrder.BZNAME" disabled="" style="color:gray;">
						</div>
					</div>
				
					<div class="layui-inline" style="color:gray;">
						<label class="layui-form-label" style="width:130px;"> 设备责任人：</label>
						<div class="layui-input-inline">
							<input type="text" id="types6" class="layui-input" v-model="manuOrder.YHNAME" disabled="" style="color:gray;">
						</div>
					</div>
				</div>	
			</div>	
	</fieldset>
	
	
	 <fieldset class="layui-elem-field layui-field-title" id='window2'>
  <legend><font color="white">设备保养项目及说明</font></legend>
  <button type="button"  class="layui-btn" @click="Totalselection">全选</button>
   &nbsp;&nbsp;&nbsp;
  <button type="button"  class="layui-btn" @click="Cancelselection">取消全选</button>
  	<div id = 'lastresultId'>
  	</div>
			
	</fieldset>	
	
	
			
			
			
			
	<div class="layui-form-item" id='window4'> 
		<button type="button"  class="layui-btn" @click="saveProductionData">提交</button>
		&nbsp;&nbsp;&nbsp;
		<button type="button"  class="layui-btn" @click="reset">重置</button>
	</div>
</form>
	<script type="text/javascript">
    var vm = new Vue({
		el : "#production",
		data : {
			selected:'',
			shebeicode:'',
			sels:[],
			manuOrder:{}
		},
		init:function(){
			 var _self = this;
	       	 this.$nextTick(function() {
					this.$http.post("../../equipment/initProcessInfo",{},{emulateJSON: true}).then(function(res){
						if(res.ok){
							_self.sels = res.body.Plans;
						}
						layui.use(['form'], function(){
							var form = layui.form;
							form.on('select(processId)', function(data){
								$('#lastresultId').hide();
							    document.getElementById("types2").value = "";
							    document.getElementById("types5").value = "";
							    document.getElementById("types6").value = "";
								 _self.selected = data.value;
							         $.ajax({
									    url: "../../equipment/loadCollectionByProcessId.html",
									    type: 'POST',
									    async: false,
									    data: {
									           CODE:_self.selected
										      },
									    dataType: 'json',
										success: function(data) {
										   if(data.result){
										   	   var failices = data.failices;
										   	   var optionstring = "";
										       							               
								               if(failices.length == 0){
								               		 layer.msg("计划编码为"+_self.selected+"下的记录无设备需要保养");
								               		 $('#window1').hide();
								               		 $('#window2').hide();
								               		  $('#window3').hide();
								               		   $('#window4').hide();
								               }else{
								               		
								                $('#window1').show();
								                $('#window2').show();
								                $('#window3').show();
								                 $('#window4').show();
								                 
									             for(var i = 0 ; i < failices.length ; i++){
									                    optionstring += "<option value=\"" + failices[i].SHEBEICODE + "\" >" + failices[i].SHEBEICODE + "</option>";
									             };
								               	 $("#facilityId").html('<option value=""></option>' + optionstring);
								                 form.render('select'); //这个很重要
								               }
										   }else{
										       layer.msg("处理失败");
										   }
										}
									});
						   	});
						   	
						   	
						   form.on('select(facilityId)', function(data){
								 _self.shebeicode = data.value;
							         $.ajax({
									    url: "../../equipment/EquipmentInformation.html",
									    type: 'POST',
									    async: false,
									    data: {
									           PLANCODE:_self.selected,
									           CODE :_self.shebeicode
										      },
									    dataType: 'json',
										success: function(data) {
										   if(data.result){
										   	  
											  _self.allresults = data.information;
										   	  _self.manuOrder = data.information[0];
										   	  
										   	  if(data.information.length == 0){
										   	 	 $('#window1').hide();
								               		 $('#window2').hide();
								               		   $('#window4').hide();
								               		    layer.msg("计划编码为"+_self.selected+"下的设备无保养项目！");
										   	 }else{
										   	        $("#types2").val(_self.manuOrder.NAME);
										   	        $("#types5").val(_self.manuOrder.BZNAME);
										   	        $("#types6").val(_self.manuOrder.YHNAME);
										   			 $('#window1').show();
								               		 $('#window2').show();
								               		 $('#window4').show();
								               		 $('#lastresultId').show();
										   	  
										   	  if(_self.manuOrder.STATUS == 'USE'){
										   	  	_self.manuOrder.STATUS = '正常'
										   	  }else if(_self.manuOrder.STATUS == 'FREE'){
										   	  	_self.manuOrder.STATUS = '封存'
										   	  }else if(_self.manuOrder.STATUS == 'STOP'){
										   	  	_self.manuOrder.STATUS = '报废' 
										   	  }
										   	 
										   	 var equipmentwork = "";
										   	 
										   	 
										   	
										   	 
										   	 for( i = 0 ; i<data.information.length ; i++){
										   	  	
										   	 	equipmentwork +="<div class='layui-form-item'> " ;
										   	 	equipmentwork +="<div class='layui-inline'>";
										   	 	equipmentwork +="<label class='layui-form-label' style='width:230px;'>" + data.information[i].MAINTAIN_NAME + "</label>";
										   	 	equipmentwork +="<div class='layui-input-inline' style='background-color: #fff;width: 130px;height: 38px;'>";
										   	 	equipmentwork +="<input type='checkbox' name='YES' lay-skin='primary' title='勾选完成' id ='"+ _self.allresults[i].MAINTAIN_NAME+"' value="+data.information[i].MAINTAIN_NAME+">";
										   	 	equipmentwork +="</div>";
										   	 	equipmentwork +="</div>";
										   	 	equipmentwork +="<div class='layui-inline'>";
										   	 	equipmentwork +="<label class='layui-form-label'>保养说明：</label>";
										   	 	equipmentwork +="<div class='layui-input-inline' style='width:430px;'>";
										   	 	equipmentwork +="<input type='text' id='workflowrank"+i+"' name='username' lay-verify='required' placeholder='请输入' autocomplete='off' class='layui-input' style='width:430px;'>";
										   	 	equipmentwork +="</div>";
										   	 	equipmentwork +="</div>";
										   	  }
									   	 	  $("#lastresultId").html(equipmentwork);
							                  form.render(); //这个很重要
							                }  
										   }else{
										       layer.msg("处理失败");
										   }
										}
									});
						   	});
						   	
						});
					});
			 }); 
		},
		methods: {
		saveProductionData:function(data){
		
		
			var _self = this;
			
			var str=document.getElementsByName("YES");
		    var objarray=str.length;
			var chestr="";
			var Remarks = "";
			var resultout = "";
			var Equipmenttype = "maintain";
			for (i=0;i<objarray;i++){
				 if(str[i].checked == true)
				 {
				  chestr+=str[i].value+","; //获取复选框的value值
				  Remarks+= document.getElementById("workflowrank"+i+"").value+",";  //获取保养说明输入框的值
				 }
			}
		
			if(_self.selected == ""){
				layer.msg("请选择计划编码");
			}else{
				if(_self.shebeicode == ""){
					layer.msg("请选择设备编码");
				}else{
					if(chestr == ""){
					  layer.msg("请勾选一个保养项目");
					}else{
						var data ={
						resultout : resultout,
						Equipmenttype : Equipmenttype,
					    Remarks : Remarks,
						CODE :_self.shebeicode,
						PLANCODE:_self.selected,
						CHESTR : chestr,
						user : _self.manuOrder.YHNAME
						};
		            	 this.$nextTick(function() {
		 					this.$http.post("../../equipment/EquipmentPreservation",data,{emulateJSON: true}).then(function(res){
		 						if(res.ok){ 		
									  _self.result = res.body.results;	
											 			
								     if(_self.result == "false"){
										layer.msg("处理失败"); 				
									 }else{	
										layer.msg("处理成功");
										window.setTimeout(function() {
											window.location.reload();
									     }, 1000);
									  }			
									  			
								}else{
									layer.msg("处理失败"); 	
								 }
		 					});
		 				}); 
					}
				 }
			  }
			
		},
			reset:function(data){
					window.location.reload();
			},
		    Totalselection:function(data){
		    	var _self = this;
				for(var i=0;i< _self.allresults.length;i++){
					document.getElementById( _self.allresults[i].MAINTAIN_NAME).checked = true; 
				}
				layui.use(['form'], function(){
					layui.form.render();
				});
				selectIds = [];
			},
			Cancelselection:function(data){
				var _self = this;
				for(var i=0;i< _self.allresults.length;i++){ 
					document.getElementById(_self.allresults[i].MAINTAIN_NAME).checked = false; 
				}
				layui.use(['form'], function(){
					layui.form.render();
				});
				selectIds = [];
			}
	  	},
			

	});
    </script>
</body>
</html>
